<template>
  <view class="tab-tatus">
    <AtTabs
      :swipeable="false"
      :current="AtTabsCurrent"
      :tabList="AtTabsList"
      :onClick="AtTabsClick"
    >
      <AtTabsPane :current="AtTabsCurrent" :index="0">
        <view class="tab-tatus-list">
          <text
            v-for="(item, key) in tabTatusList[0]"
            class="tab-tatus-list-item"
            :class="tabTatusCurrent[0] == key ? 'cur' : ''"
            :key="key"
            @click="tabTatusClick(0, key)"
            >{{ item.name }}</text
          >
        </view>
      </AtTabsPane>

      <!-- 我接收的订单 -->
      <AtTabsPane :current="AtTabsCurrent" :index="1">
        <view class="tab-tatus-list">
          <text
            v-for="(item, key) in tabTatusList[1]"
            class="tab-tatus-list-item"
            :class="tabTatusCurrent[1] == key ? 'cur' : ''"
            :key="key"
            @click="tabTatusClick(1, key)"
            >{{ item.name }}</text
          >
        </view>
      </AtTabsPane>
    </AtTabs>
  </view>

  <view class=""> </view>
</template>
<script>
import Taro from "@tarojs/taro";
import "./tab-tatus.less";
import { toRefs, reactive, watch } from "@vue/runtime-core";
import { AtTabs, AtTabsPane } from "taro-ui-vue";
export default {
  name: "liboItem",
  props: ["current"],
  setup(props, { attrs, slots, emit }) {
    const state = reactive({
      AtTabsList: [{ title: "我接的单" }, { title: "我发布的" }],
      AtTabsCurrent: 0,  //    2 接单  1 发布

      //tabtatus 列表
      // 订单状态  1 待审核  2已发布  3 已接单  4 已进场 5 施工中 6 待验收  7 已完成 8 已取消  9 待付款',
      tabTatusList: {
        0: [
          { name: "全部订单", status: 0 },
          { name: "已接单", status: 3 },
          { name: "进场", status: 4 },
          { name: "施工", status: 5 },
          { name: "已完成", status: 7 },
        ],
        1: [
          { name: "全部订单", status: 0 },
          { name: "审核中", status: 1 },
          { name: "已发布", status: 2 },
          { name: "已接单", status: 3 },
          { name: "已完成", status: 7 },
        ],
      },
      tabTatusCurrent: {
        0: 0,
        1: 0,
      },
    });

    //切换列表
    const AtTabsClick = function (val) {
      state.AtTabsCurrent = val;
      console.log(val,'---val')
      upOrderList();
    };

    const tabTatusClick = function (index, status) {
      state.tabTatusCurrent[index] = status;
      upOrderList();
    };

    const upOrderList = () => {
      var tabTatusCurrent = state.tabTatusCurrent[state.AtTabsCurrent]
      var params = {
        mode: state.AtTabsCurrent==1?1:2, //类型
        status: state.tabTatusList[state.AtTabsCurrent][tabTatusCurrent].status, //状态
      };
      emit("getData", params);
    };

    return {
      ...toRefs(props),
      ...toRefs(state),

      AtTabsClick,
      tabTatusClick,
    };
  },
  //子模板
  components: {
    AtTabs,
    AtTabsPane,
  },
};
</script>